import {useRef, useEffect} from 'react'
import { Modal, Form, FormInstance, Input, Select, message } from 'antd';
import {addThemeRequest} from './ajax'
import { awaitWrap } from '@src/assets/js/tool';

const {Item} = Form
const {Option} = Select

async function addHandle (caseid: string, d: { [k: string]: any }, refreshFn: () => void) {
  const h = message.loading('提交中', 120)
  const [e] = await awaitWrap(addThemeRequest(caseid, d.name, '自定义送达'))
  h()
  if (e === null) {
    message.success('添加成功')
    refreshFn()
  }
}

interface Props {
  caseid: string
  visible: boolean
  hide: () => void
  refreshFn: () => void
}

function Main ({caseid, visible, hide, refreshFn}: Props) {
  const formRef = useRef<FormInstance>(null)
  useEffect(() => {
    const c = formRef.current
    if (!visible && c) {
      c.resetFields()
    }
  }, [visible])
  return (
    <div>
      <Modal title='添加自定义送达' visible={visible} onCancel={() => hide()} onOk={() => formRef.current?.submit()}>
        <Form ref={formRef} onFinish={d => addHandle(caseid, d, () => { refreshFn(); hide(); })}>
          <Item name='name' label='送达名称' rules={[{ required: true, message: '送达名称不能为空' }]}>
            <Input placeholder='请输入送达名称' />
          </Item>
          {/* <Item name='type' label='送达类型' rules={[{ required: true, message: '送达类型不能空' }]}>
            <Select placeholder='请选择送达类型'>
              <Option value='自定义送达'>自定义送达</Option>
              <Option value='仲裁员送达'>仲裁员送达</Option>
            </Select>
          </Item> */}
        </Form>
      </Modal>
    </div>
  )
}

export default Main